<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<meta http-equiv="X-UA-Compatible" content="IE=edge">
	<title></title>
	<link rel="stylesheet" href="">
</head>
<body>
<script src="http://unpkg.com/vue/dist/vue.js"></script>
<script src="https://unpkg.com/vue-router/dist/vue-router.js"></script>	
<div id="root">
	<!--路由入口文件 router-link跟那个a标签有点相似-->
	<router-link :to="{name:'user',params:{port_id:123}}">User</router-link>
	<div><!--渲染的地方-->
		<router-view></router-view>
	</div>
</div>
<script>
	const User = {
		template : `<div>这是用户栏</div>`,
	};
	//router.push({ name: 'user', params: { userId: 123 }})
	const router = new VueRouter({
		routes : [
			{
				path : '/user/:port_id',
				name : 'user',
				component : User,
			}
		]
	})
	const vm = new Vue({
		router
	}).$mount('#root');
</script>
</body>
</html>